<template>
    <div class="easyd-weixin-Box">

        <div class="app_page_box" style="bottom: 50px;">
            <div class="app_page">
                <div class="app_list_box MARGIN_BOTTOM_10">
                    <div class="app_box_content">
                        <div class="app_box_content_left">
                            订单详情
                        </div>
                        <div class="app_box_content_right" v-if="orderDetail.apo_status == 1">
                            已支付
                        </div>
                        <div class="app_box_content_right" v-if="orderDetail.apo_status == 0">
                            未支付
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_left C4">
                            订单号：
                        </div>
                        <div class="app_box_content_left">
                            {{orderDetail.apo_no}}
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_left C4">
                            姓　名：
                        </div>
                        <div class="app_box_content_left">
                            {{orderDetail.apo_contact}}
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_left C4">
                            电　话：
                        </div>
                        <div class="app_box_content_left">
                            {{orderDetail.apo_phone}}
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_left C4">
                            账　号：
                        </div>
                        <div class="app_box_content_left">
                            {{orderDetail.apo_campus_name}}
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_left C4">
                            校　区：
                        </div>
                        <div class="app_box_content_left">
                            {{orderDetail.schoolName}}
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_left C4">
                            时　间：
                        </div>
                        <div class="app_box_content_left">
                            {{$common.getTimes(orderDetail.apo_create_time,'shifen')}}
                        </div>
                    </div>
                </div>
                <div class="app_list_box MARGIN_BOTTOM_10">
                    <div class="app_box_content">
                        <div class="app_box_content_left" style="margin: 0 auto;">
                            售中服务
                        </div>
                    </div>
                    <div class="app_box_content">
                        <div class="app_box_content_textarea">
                            <textarea name="" rows="10" cols="" v-model="serviceContent"
                                      placeholder="请填写服务内容!"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="app_bottom_box" @click="submit(orderDetail)">
            <div class="app_bottom_box_right">
                提交保存
            </div>
        </div>

    </div>
</template>

<script>
    import {mapState, mapMutations} from "vuex";

    export default {

        data() {
            return {
                serviceContent: ''
            };
        },
        computed: {
            ...mapState({
                orderDetail: state => state.OrderDetailModule.orderDetail
            })
        },
        mounted() {
            this.initData();
        },
        methods: {

            //  ...mapMutations(["ShopIndexModule/updateIsShopGuide"]),

            initData() {
                this.$easyUtil.startLoading(this);
                this.$http.getHttp(
                    this.$API.apiOrderProcessing + "/order_id/" + this.$route.query.order_id,
                    rs => {
                        this.$easyUtil.endLoading(this);
                        console.log(rs);
                        this.$store.commit("OrderDetailModule/updateOrderDetail", rs.orderInfo[0]);
                        this.getNodeData(0, 0);
                    }
                );
            },
            submit(item) {
                console.log(item);

                var param = {
                    apo_nickname: item.apo_nickname,
                    apo_phone: item.apo_phone,
                    cs_uid: this.$userData.getUID(),
                    apo_openid: item.apo_openid,
                    c_osid: this.$userData.getOsid(),
                    cs_content: this.serviceContent,
                    cs_way: 0,
                    apo_no: item.apo_no,
                };

                this.$easyUtil.startLoading(this)
                this.$http.postHttp(this.$API.apiAddingServiceRecords, param, (rs) => {

                    this.$easyUtil.endLoading(this);
                    this.$easyUtil.successToast(this, '服务添加成功');
                    this.serviceContent = '';
                    history.go(-1);

                })
            },

            uploadChange(e) {
                console.log("上传");
            },
        }
    };
</script>

<style lang="stylus" scoped>
    @import '~PUBLIC_CSS';
</style>